<template>
    <div style="cursor:pointer;display:inline-block;"
        v-clipboard:copy="data"
        v-clipboard:success="onCopy"
        v-clipboard:error="onError">
        <slot name="content">
            <el-button v-if="type == 'button-text'" size="small">复制</el-button>
            <el-button v-else-if="type == 'button-icon'" size="mini" icon="el-icon-document-copy"></el-button>
            <i v-else class="el-icon-document-copy"></i>
        </slot>
    </div>
</template>

<script>
    import Vue from 'vue';
    import VueClipboard from 'vue-clipboard2';
    Vue.use(VueClipboard);
    export default({
        props: {
            data: {type: String},
            type: {type: String, default: function(){return 'button-text'}},
        },
        data(){
            return {
                
            }
        },
        created(){
            
        },
        methods:{
            onCopy: function (e) {
                this.$message.success('复制成功！');
            },
            onError: function (e) {
                this.$message.error('无法复制，浏览器不支持！')
            }
        }
    })
</script>
